<!-- 问卷 -->
<template>
	<view class="questionnaire-page">
		<view class="questionnaire-page2">
			<view class="questionnaire-head">
				<view class="questionnaire-head-value">
					<span>Magisches</span>
					<span>Element</span>
				</view>
				<view class="questionnaire-head-value2">
					<span>复杂敏感肌</span>
				</view>
			</view>
			<view class="questionnaire-title">
				<span>修护不困难</span>
			</view>
			<view class="questionnaire-value">
				<span>这里准备了6道问题</span>
				<span>帮你判断你的肌肤是否复杂敏感肌</span>
			</view>
		</view>
		
		<view class="questionnaire-foot">
			<view class="questionnaire-time">
				<span>答题约20s</span>
			</view>
			<view class="questionnaire-go" @tap="jump('/pages/questionnaire/questionnaire_info', { id: id })">
				GO
			</view>
		</view>
	</view>
	
	
</template>

<script>

import { mapMutations, mapActions, mapState, mapGetters } from 'vuex';
export default {
	components: {
	},
	data() {
		return {
			id:0,
			qInfo:[],
		};
	},
	// 是否登录
	computed: {
		...mapGetters(['isLogin', 'authType']),
	},
	onLoad(e){
		let that = this;
		that.id=e.id;
		this.getQinfo();
	},
	methods: {
		// 检测
		checkActivity(data, type) {
			if (data) {
				return !data.includes(type);
			}
			return true;
		},
		// 路由跳转
		jump(path, parmas) {
			this.showShare = false;
			this.$Router.push({
				path: path,
				query: parmas
			});
		},
		// 回到首页
		goHome() {
			this.$Router.replaceAll('/pages/index/index');
		},

		// 选项卡
		onTab(id) {
			this.tabCurrent = id;
		},
		
		// 组件返回的type;
		changeType(e) {
			this.buyType = e;
		},
		// 组件返回的规格;
		getSkuText(e) {
			this.currentSkuText = e;
		},
		getQinfo(){
			let that = this;
			that.$http(
				'questionnaire.qInfo', {
					id:that.id
				},
			).then(res => {
				that.qInfo=res.data;
				
			}).catch(e => {
				reject(e)
			});
		}
	}
};
</script>

<style lang="scss">
.questionnaire-page{
}
.questionnaire-page2{
	width: 100%;
	height: 990rpx;
	// border: 2rpx solid #000;
}
.questionnaire-head{
	color: #444;
	width: 573rpx;
	height: 558rpx;
	background-color:#bebebe;
	box-shadow: 0rpx 0rpx 17rpx 2rpx rgba(0,0,0,0.04);
	border-radius: 42rpx;
	margin: 37rpx auto 0 auto;
}
.questionnaire-head-value{
	font-size: 30rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
    float: right;
    margin: 64rpx 45rpx 0 0;
}
.questionnaire-head-value2{
	font-size: 85rpx;
    float: left;
	margin: 216rpx 0 0 16rpx;
}
.questionnaire-title{
	margin: 12rpx 0 131rpx 131rpx;
	color: #444;
	font-size: 56rpx;
}
.questionnaire-value{
	font-size: 21rpx;
	color: #444;
	margin-left: 135rpx;
	display: flex;
	flex-direction: column;
	span{
		margin-bottom: 10rpx;
	}
}
.questionnaire-foot{
    margin: 40rpx 133rpx 0 135rpx;
	display: flex;		
	justify-content: space-between;
}
.questionnaire-time{
	color: #444;
	font-size: 29rpx;
	padding-top: 40rpx;
}	
.questionnaire-go{
	color: #444;
	font-size: 35rpx;
	width: 88rpx;
	height: 88rpx;
	background-color:#bebebe;
	border-radius: 30rpx;
	padding-top: 25rpx;
	text-align: center;
}    
</style>
